export function bindEvents(shadowRoot, selectedItem, menuItems, instance) {
    const menuItemElements = shadowRoot.querySelectorAll('.menu-item');
    
    menuItemElements.forEach(item => {
        item.addEventListener('click', (e) => {
            // 阻止默认行为（包括a标签跳转）
            e.preventDefault();
            e.stopPropagation();
            
            const value = item.getAttribute('data-value');
            const menuItem = menuItems.find(mi => mi.value === value);
            
            // 确保所有菜单项都能触发路由切换
            if (menuItem && menuItem.href) {
                window.history.pushState({}, '', menuItem.href);
                
                // 触发自定义路由变化事件
                window.dispatchEvent(new CustomEvent('route-change', {
                    detail: { path: menuItem.href, value: value }
                }));
            }
            
            selectItem(value, selectedItem, menuItems, instance);
        });
    });
    
    // 为a标签单独添加事件监听，确保阻止默认行为
    const linkElements = shadowRoot.querySelectorAll('a.menu-text');
    linkElements.forEach(link => {
        link.addEventListener('click', (e) => {
            e.preventDefault();
            e.stopPropagation();
        });
    });
}

export function selectItem(value, currentSelectedItem, menuItems, instance) {
    const menuItem = menuItems.find(item => item.value === value);
    
    if (currentSelectedItem !== value) {
        instance.selectedItem = value;
        
        // 只更新选中状态的视觉效果，不重新渲染整个组件
        updateSelectedState(instance.shadowRoot, value);
        
        // 派发选中事件
        instance.dispatchEvent(new CustomEvent('menu-selected', {
            detail: { value, label: menuItem?.label }
        }));
    }
}

// 新增函数：只更新选中状态的视觉效果
function updateSelectedState(shadowRoot, selectedValue) {
    const menuItems = shadowRoot.querySelectorAll('.menu-item');
    menuItems.forEach(item => {
        const value = item.getAttribute('data-value');
        if (value === selectedValue) {
            item.classList.add('selected');
        } else {
            item.classList.remove('selected');
        }
    });
}

export function getMenuItems() {
    return [
        { value: 'featured', label: '精选', icon: 'star', iconFill: 'star-fill' , isLogin : false , href : "/"},
        { value: 'recommend', label: '推荐', icon: 'heart', iconFill: 'heart-fill' , isLogin : true , href : "/recommend"},
        { value: 'follow', label: '关注', icon: 'person-plus', iconFill: 'person-plus-fill' , isLogin : true , href : "/follow"},
        { value: 'friends', label: '朋友', icon: 'people', iconFill: 'people-fill' , isLogin : true , href : "/friends"},
        { value: 'mine', label: '我的', icon: 'person', iconFill: 'person-fill' , isLogin : true , href : "/mine"},
        { value: 'live', label: '直播', icon: 'camera-video', iconFill: 'camera-video-fill' , isLogin : false , href : "/live"},
        { value: 'cinema', label: '放映厅', icon: 'play-circle', iconFill: 'play-circle-fill' , isLogin : false , href : "/cinema"},
        { value: 'quotes', label: '短句', icon: 'chat-quote', iconFill: 'chat-quote-fill' , isLogin : false , href : "/quotes"}
    ];
}